<template>
<Theme >
<div slot="main">
<el-form ref="store" :model="store" label-width="80px">
  <el-form-item label="门店名称">
    <el-input v-model="store.storeName"></el-input>
  </el-form-item>
  <el-form-item label="营业执照">
    <el-input v-model="store.storeLicense"></el-input>
  </el-form-item>
  <el-form-item label="营业地址">
    <el-input v-model="store.storeAddress"></el-input>
  </el-form-item>
  <el-form-item label="定位">
    <el-input v-model="store.storeLocation"></el-input>
  </el-form-item>
  <el-form-item label="法人">
    <el-input v-model="store.storeBoss"></el-input>
  </el-form-item>
  <el-form-item label="联系电话">
    <el-input v-model="store.storeTel"></el-input>
  </el-form-item>
  <el-form-item label="特色">
    <el-input v-model="store.storeFeature"></el-input>
  </el-form-item>
  <el-form-item label="佣金比例">
    <el-input v-model="store.storeProportion"></el-input>
  </el-form-item>
  <el-form-item label="vip等级">
      <el-radio v-model="store.storeLevel" label="是">是</el-radio>
     <el-radio v-model="store.storeLevel" label="否">否</el-radio>
    </el-form-item>
  <el-form-item label="上传门店照片">
    <el-upload
      :action="url"
      list-type="picture-card"
      :before-upload="beforeUpload"
      :on-preview="handlePictureCardPreview"
      :on-remove="handleRemove"
      :on-success="onSuccess"
      :limit="1">
      <i class="el-icon-plus"></i>
    </el-upload>
    
    <el-dialog :visible.sync="dialogVisible">
      <img width="100%" :src="dialogImageUrl" alt="">
    </el-dialog>
  </el-form-item>
 
  
  <el-form-item>
    <el-button type="primary" @click="onSubmit">确定</el-button>
    <el-button>取消</el-button>
  </el-form-item> 
</el-form>
</div>
<BreadNav slot="breadNav" />
</Theme>
  
</template>

<script>
import {addStore} from '@/services/StoreService.js'
import Theme from '@/components/Theme.vue'
import BreadNav from '@/components/BreadNav.vue'
 export default {
    components:{
      Theme,BreadNav
    },
    data() {
      return {
        // form: {
        //   name: '',
        //   region: '',
        //   date1: '',
        //   date2: '',
        //   delivery: false,
        //   type: [],
        //   resource: '',
        //   desc: ''
        // }
        store:{
            storeName:"",
            storeLicense:"",
            storeAddress:"",
            storeLocation:"",
            storeBoss:"",
            storeTel:"",
            storeFeature:"",
            storeProportion:"",
            storeLevel:"",
            storePic:"",
            storeState:"申请中"
        },
        dialogImageUrl: '',
        dialogVisible: false,
        url:"/api/petSystem/upload.do"
      }
    },
    methods: {
     async onSubmit() {
        console.log('submit!');
        console.log(this.store);
        var resp = await addStore(this.store);
        if(resp.data==true){
            this.$router.push({name:"Store"});
        }else{
            console.log("添加失败.....");
        }

      },
      handleRemove(file, fileList) {
        console.log(file, fileList);
      },
      handlePictureCardPreview(file) {
        console.log("图片的url地址是：");
        console.log(file.url);
        this.dialogImageUrl = file.url;
        this.dialogVisible = true;
      },
      beforeUpload(file){
        console.log("上传文件之前");
          console.log(file);
      },

      onSuccess:function(res){
        console.log(res);
        console.log(this.dialogImageUrl);
        if(res.code==0){
          console.log(res.data.path);
          this.store.storePic=res.data.path;
        }
      }

    }
  }
</script>

<style>

</style>